import React, { memo, useEffect, useState } from 'react'
// 引入类型：
import type { ReactNode } from 'react'
import hyRequest from '../../../../service'

interface IProps {
	children?: ReactNode
}

interface IBannerData {
	imageUrl: string
	targetId: number
	targetType: number
	titleColor: string
	typeTitle: string
	url: any
	exclusive: boolean
	scm: string
	bannerBizType: string
}

// 对组件进行类型定义，FC 表示函数式组件（即：FunctionComponents）
const recommend: React.FC<IProps> = () => {
	const [bannerData, setBannerData] = useState<IBannerData[]>([])

	useEffect(() => {
		hyRequest
			.get({
				url: '/banner'
			})
			.then((res) => {
				setBannerData(res.banners)
			})
	}, [])

	return (
		<div>
			<ul>
				{bannerData.map((item: any) => {
					return <li key={item.targetId}>{item.typeTitle}</li>
				})}
			</ul>
		</div>
	)
}

export default memo(recommend)
